<!doctype html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <link rel="stylesheet" href="style.css">
    <title>Home</title>
</head>
<body>
    <nav>
        <div class="container">
                <ul>
                    <li><img src="img/brand-white.png"></li>
                    <li><a href="">Home</a></li>
                    <li><a href="">Profile</a></li>
                    <li><a href="">Messages</a></li>
                    <li><a href="">Dosc</a></li>
                </ul>
        </div>
    </nav>
        <div class="container">
            <div class="row">
                <div class="col-3">
                    <div class="itme3">
                        <img src="img/iceland.jpg" class="img1">
                        <img src="img/avatar-dhg.png" class="img2">
                        <h3>Dave Gamache</h3>
                        <p>Iwish i was a little bit taller,wish i was a baller.</p>
                    </div>
                    <div class="itme">
                        <h4>About</h4>
                        <p>Went to <span>Oh,Canada</span></p>
                        <p>Became friends with <span>Obama</span></p>
                        <p>Worked at <span>Github</span></p>
                        <p>lives in <span>San Francisco,CA</span></p>
                        <p>From <span>Seattle,WA</span></p>
                    </div>
                    <div class="itme">
                        <h4>Photos</h4>
                        <div class="row">
                            <div class="col-6">
                                <div class="itme1">
                                    <img src="img/instagram_5.jpg">
                                </div>
                            </div>
                            <div class="col-6">
                                <div class="itme1">
                                    <img src="img/instagram_6.jpg">
                                </div>
                            </div>
                            <div class="col-6">
                                <div class="itme1">
                                    <img src="img/instagram_7.jpg">
                                </div>
                            </div>
                            <div class="col-6">
                                <div class="itme1">
                                    <img src="img/instagram_8.jpg">
                                </div>
                            </div>
                            <div class="col-6">
                                <div class="itme1">
                                    <img src="img/instagram_9.jpg">
                                </div>
                            </div>
                            <div class="col-6">
                                <div class="itme1">
                                    <img src="img/instagram_10.jpg">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-6">
                    <div class="itme">
                            <div class="m-6-top">
                                <h5>Dave Gamache</h5><span>4 min</span>
                                    <p>
                                        Aenean lacinia bibendum nulla sed consectetur. Vestibulumid ligulaporta
                                        felis euismod semper. Morbi leo risus, porta ac consectetur ac,vestibulum at eros. Cras justo odio,dapobus ac facilisis in,egesta eget quam . Vestib ulum id ligula portafelis
                                        euismod semper,Cum soxiis natoque penaatibus et magnisdis parturient montes,nascetur ridiculus mus.
                                    </p>
                            </div>
                        <div class="row">
                            <div class="col-6">
                                <div class="itme2">
                                    <img src="img/unsplash_1.jpg">
                                </div>
                            </div>
                            <div class="col-6">
                                <div class="itme2">
                                    <img src="img/instagram_1.jpg">
                                </div>
                            </div>
                            <div class="col-6">
                                <div class="itme2">
                                    <img src="img/instagram_13.jpg">
                                </div>
                            </div>
                            <div class="col-6">
                                <div class="itme2">
                                    <img src="img/unsplash_2.jpg">
                                </div>
                            </div>
                        </div>
                        <p><span>Jacon thornton:</span>Aenean lacinia bibendum nulla sed consectetur. Vestibu lumid ligulaporta
                            felis euismod semper. Morbi leo risus, porta ac consec tetur ac,vestibulum at eros. Cras justo odio,dapobus ac facilisis in,egesta eget quam . Vestib ulum id ligula.</p>
                        <p><span>Mark Otto:</span>Aenean lacinia bibendum nulla sed consectetur. Vestibulum idligulaporta
                            felis euismod semper. Morbi leo risus, porta ac consectetur ac,vestibulum at eros. Cras justo odio,dapobus.</p>
                    </div>
                    <div class="itme4">
                        <div class="m-6-top">
                            <h5>Jacob Thornton</h5><span>12 min</span>
                        </div>
                        <p>
                            Aenean lacinia bibendum nulla sed consectetur. Vestibulumid ligulaporta
                            felis euismod semper. Morbi leo risus, porta ac consectetur ac,vestibulum at eros. Cras justo odio,dapobus ac facilisis in,egesta eget quam . Vestib ulum id ligula portafelis
                            euismod semper,Cum soxiis natoque penaatibus et magnisdis parturient montes,nascetur ridiculus mus.
                        </p>
                    </div>
                    <div class="itme">
                        <div class="m-6-top">
                            <h5>Mark Otto</h5><span>34 min</span>
                        </div>
                        <p>
                            Aenean lacinia bibendum nulla sed consectetur. Vestibulumid ligulaporta
                            felis euismod semper. Morbi leo risus, porta ac consectetur ac,vestibulum at eros. Cras justo odio,dapobus ac facilisis in,egesta eget quam . Vestib ulum id ligula portafelis
                            euismod semper,Cum soxiis natoque penaatibus et magnisdis parturient montes,nascetur ridiculus mus.
                        </p>

                                <img src="img/instagram_3.jpg"  class="img4">
                        <p><span>Dave Gamache:</span>Aenean lacinia bibendum nulla sed consectetur. Vestibulum idligulaporta
                            felis euismod semper. Morbi leo risus, porta ac consectetur ac,vestibulum at eros. Cras justo odio,dapobus.</p>
                    </div>
                </div>
                <div class="col-3">
                    <div class="itme">
                        <h4>Sponsored</h4>
                        <img src="img/instagram_2.jpg" class="img5">
                        <h5>It might be time to visit lceland.</h5>
                        <p>
                            Lceland is so chill,and everything looks cool here.Also, we heard the people arepretty nice.What are you waiting for?
                        </p>
                        <button>Buy ticket</button>
                    </div>
                    <div class="itme">
                        <h4>Likes</h4>
                        <div class="row">
                            <div class="col-3">
                                <div class="itme7">
                                    <img src="img/avatar-fat.jpg">
                                </div>
                            </div>
                            <div class="col-8">
                                    <p><b>Jacob Thornton</b>@fat</p>
                                    <button class="but2">Follow</button>
                            </div>
                            <div class="col-3">
                                <div class="itme7">
                                    <img src="img/avatar-mdo.png">
                                </div>
                            </div>
                            <div class="col-8">
                                    <p><b>Mark Otto</b>@mdo</p>
                                    <button class="but2">Follow</button>
                            </div>
                        </div>
                        <div class="itme6">
                            <p>
                                Dave really likes thes nerds,no one konws why though.
                            </p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    <footer>
        <div class="container">
            <p>Designed and built built with all the love in the world by <span>@mdo,@fat</span> and <span>@dhg.</span></p>
            <ul>
                <li><a href="">About</a></li>
                <li><a href="">Terms</a></li>
                <li><a href="">Privacy</a></li>
                <li><a href="">Licenses</a></li>
                <li><a href="">FAQ</a></li>
            </ul>
        </div>
    </footer>
</body>
</html>